<!DOCTYPE html>
<html lang="en"  style="height: 100%">
<head>
    <meta charset="UTF-8">
    <title>地点和职位数关系图</title>
    <script src="/static/jquery-1.12.0.min.js"></script>
    <script src="/static/echarts.min.js"></script>
    <script src="/static/china.js"></script>
</head>
<body style="height: 100%">
<div id="main" style="height: 100%"></div>
<script>
    $(function () {

        
        $.ajax({
            url:'/dd/zwmc',
            type:'get',
            dataType:'json',
            success:function (returnData) {
                if(returnData.status==1)
                {
                    var geoCoordMap = returnData.geoCoordMap;
                    var convertData = function (data) {
                        var res = [];
                        for (var i = 0; i < data.length; i++) {
                            var geoCoord = geoCoordMap[data[i].name];
                            if (geoCoord) {
                                res.push(geoCoord.concat(data[i].value));
                            }
                        }
                        return res;
                    };

                    myoption = {
                        backgroundColor: '#404a59',
                        title: {
                            text: '地点和职位数关系图',
                            subtext: '职位画像系统',
                            sublink: 'http://www.ibeifeng.com',
                            left: 'center',
                            textStyle: {
                                color: '#fff'
                            }
                        },
                        visualMap: {
                            min: 0,
                            max: 30000,
                            splitNumber: 10,
                            bottom:'2%',
                            inRange: {
                                color: ['#d94e5d','#eac736','#50a3ba'].reverse()
                            },
                            textStyle: {
                                color: '#fff'
                            }
                        },
                        geo: {
                            map: 'china',
                            label: {
                                emphasis: {
                                    show: false
                                }
                            },
                            roam: true,
                            itemStyle: {
                                normal: {
                                    areaColor: '#323c48',
                                    borderColor: '#111'
                                },
                                emphasis: {
                                    areaColor: '#2a333d'
                                }
                            }
                        },
                        series: [{
                            name: 'AQI',
                            type: 'heatmap',
                            coordinateSystem: 'geo',
                            data: convertData(returnData.count_zw)
                        }]
                    };
                    var myChart = echarts.init(document.getElementById('main'));
                    myChart.setOption(myoption);
                }
                else
                {
                    alert('暂无数据')
                }
            }
        })

    })
</script>
</body>
</html>